<template>
  <div style="width: 100%;height: 100%">
    <div ref="container" style="width: 100%;height: 100%"></div>
  </div>
</template>

<script>
import Charts from "@jiaminghi/charts";
import {currentGET} from "api";

export default {
  data() {
    return {
      option1: {
        xAxis: {
          name: '销售额坐标',
          data: 'value',
          axisLabel: {
            style: {
              fill: '#1ed3e5',
            }
          },
        },
        yAxis: {
          name: '销售公司名称',
          data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'],
          axisLabel: {
            style: {
              fill: '#1ed3e5',
            }
          },
        },
        series: [
          {
            data: [1200, 2230, 1900, 2100, 3500, 4200, 3985],
            type: 'bar',
            animationCurve: 'easeOutBack'
          }
        ]
      }

    }
  },
  methods: {
    async init() {
      await currentGET('big7').then(res => {
        this.option1.yAxis.data = res.data.map(item => item.name)
        this.option1.series[0].data = res.data.map(item => item.value)
      })

      const myChart = new Charts(this.$refs.container)
      myChart.setOption(this.option1)
    }
  },
  mounted() {
    this.init()
  }
}
</script>

<style>

</style>
